<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
<cpn></cpn>
</div>

<div id="app2">
  <cpn></cpn>
</div>

<script src="../js/vue.js"></script>
<script>
  //创建组件构造器
  const cpnC = Vue.extend({
    template: `
    <div>
    <h2>标签</h2>
    <p>内容</p>
    </div>
    `,
    components: {

    }
  })

  //注册组件（全局组件,意味着可以在多个Vue实例下面使用）
  // Vue.component('cpn',cpnC)

  //怎么注册局部组件呢，通过components

    const  app = new Vue({
      el:'#app',
      data:{
        message: '卢本伟牛逼！'
      },
      components : {
        //cpn使用组件时候的标签名
        cpn : cpnC
      }
    })
  const app2 = new  Vue({
    el:'#app2',
    //怎么注册局部组件呢，通过components

  })
</script>
</body>
</html>